<template>
    <div  @click="back">
        <img src="https://s.chuimg.com/pic/2013/scroll_top.png" alt="" v-if="crux">
    </div>
</template>

<script>


export default{
    data() {
        return {
            
            crux:false,
        };
    },
    methods: {
        back() {
            scrollTo(0,0);
        },
        scrollListener(){
            var scrollTop=document.body.scrollTop|| document.documentElement.scrollTop;
            if(scrollTop>=600){
                this.crux=true
            }else{
                this.crux=false
            }
        }
    },
    created() {
        window.addEventListener('scroll',this.scrollListener);
    },
    destroyed() {
        window.removeEventListener('scroll',this.scrollListener);
    },
    
    
}
</script>

<style scoped>
img{
    width: 50px;
    height: 50px;
    cursor: pointer;
    position: fixed;
    right: 100px;
    bottom: 100px;
    
}
</style>